<template>
    <div class="vipres">
        <h1>升级企业VIP<img src="@/img/vip.jpg"></h1>
        <p class="step">第<span>1</span>步</p>
        <p>注册成为本站企业会员，若已完成请勿略</p>
        <div class="btn"><router-link to="/res">企业注册</router-link></div>
        <p class="step">第<span>2</span>步</p>
        <p>点击“下载VIP企业入驻表格”，</p>
        <p>填写完毕发送管理员邮箱8888xxXX@163.com</p>
        <p>我们会第一时间联系您!</p>
        <div class="btn"><router-link to="/res">下载vip企业入驻表格</router-link></div>
    </div>
</template>
<script>
import {toRefs,reactive} from 'vue'
export default {
    setup(){
        const data = reactive({
            
        })
        return {
            ...toRefs(data)
        }
    }
}

</script>
<style scoped>
.vipres{width:800px;margin:20px auto;box-shadow:1px 1px 5px#ccc;padding:20px;text-align:center;}
.vipres hl{line-height:40px;}
.vipres hl img{width:50px;height:25px;margin-left: 10px;}
.vipres .step{font-size:18px;}
.vipres .step span{font-size:100px;font-weight:900;color:orangered;line-height: 180px;
    font-family: 'Arial Negreta',"'Arial Normal', 'Arial',"sans-serif;margin: 0px 10px;}
.vipres p{font-size:14px;line-height:25px;}
.vipres .btn{width:600px;margin:10px auto;border-radius: 5px;}
.vipres .btn a{display:block;font-size:16px;background-color:#50586c;color:white;padding:10px 0px}
.vipres .btn a:hove{background-color:orangered;color: white;}
.vipres h1 img{width:50px;height: 25px;margin-left: 10px;}
.vipres·.step{font-size:18px;}
.vipres .step span{font-size:100px;font-weight:988;color:orangered;line-height: 180px;
    font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;margin: 0px 10px;}
.vipresp{font-size:14px;line-height:25px;}
.vipres btn {width:600px;margin:10px auto;border-radius:5px;}
.vipres .btn a{display:block;font-size:16px;background-color:#50586c;color:white;padding:10px 0px;}
.vipres .btn a:hover{background-color:orangered;color: white;}
@media all and(max-width:992px){
    .vipres{width:90%;}
    .vipres .btn{width:98%;}
}

</style>